<template>
	<view class="surveyBox">
		<view class="achievement_table">
			<view class="achievement_th">
				<view class="W15"></view>
				<view style="width:14%;">编号</view>
				<view style="width:12%;">级别</view>
				<view class="W20">血缘业绩</view>
				<view class="W20">接点业绩</view>
				<view class="W20">个人业绩</view>
			</view>
			<view class="achievement_th" v-for="(ele,ind) in customerNumber" :key="ind" v-if="surveyList.length>0 && isShow==true">
				<view class="W15 firstBor" v-if="ind==0">{{ele.codeType}}</view>
				<view class="W15" v-if="ind>0"></view>
				<view style="width:14%;">{{ele.memberCode}}</view>
				<view style="width:12%;">{{ele.joinLevelName}}</view>
				<view class="W20">{{ele.introTotalSuperior}}</view>
				<view class="W20">{{ele.teamTotalSuperior}}</view>
				<view class="W20">{{ele.personal}}</view>
			</view>
			<view class="achievement_th" v-for="(ele,ind) in serviceNumber" :key="ind" v-if="surveyList.length>0">
				<view class="W15 firstBor" v-if="ind==0">{{ele.codeType}}</view>
				<view class="W15" v-if="ind>0"></view>
				<view style="width:14%;">{{ele.memberCode}}</view>
				<view style="width:12%;">{{ele.joinLevelName}}</view>
				<view class="W20">{{ele.introTotalSuperior}}</view>
				<view class="W20">{{ele.teamTotalSuperior}}</view>
				<view class="W20">{{ele.personal}}</view>
			</view>
			<view class="achievement_th" v-for="(ele,ind) in ShareNumber" :key="ind" v-if="surveyList.length>0">
				<view class="W15 firstBor" v-if="ind==0">{{ele.codeType}}</view>
				<view class="W15" v-if="ind>0"></view>
				<view style="width:14%;">{{ele.memberCode}}</view>
				<view style="width:12%;">{{ele.joinLevelName}}</view>
				<view class="W20">{{ele.introTotalSuperior}}</view>
				<view class="W20">{{ele.teamTotalSuperior}}</view>
				<view class="W20">{{ele.personal}}</view>
			</view>
		</view>
		<view v-if="surveyList.length == 0 && isShow==true">
			<emptyPage title="暂无业绩概况～"></emptyPage>
		</view>
	</view>
</template>

<script>
	import {
		getPerFormanceData
	} from '@/api/directSelling.js'
	import emptyPage from '@/components/emptyPage.vue'
	export default {
		components: {
			emptyPage
		},
		data() {
			return {
				isShow:false,
				customerNumber:[],//顾客编号
				serviceNumber:[],//服务编号
				ShareNumber:[],
				surveyList: []
			}
		},
		created() {
			uni.showLoading({
				title: '查询中',
				mask: true
			});
			this.getPerFormanceData();
		},
		methods: {
			getPerFormanceData() {
				getPerFormanceData({
					memberCode: uni.getStorageSync('account') ? uni.getStorageSync('account') : ""
				}).then((res) => {
					let data = res.data;
					let newData = [];
					data.forEach((ele, ind) => {
						if (ind == 0) { //顾客编号
							ele.selfList.forEach((e, i) => {
								e.codeType = "顾客编号";
								newData.push(e);
							})
							this.customerNumber=ele.selfList;
						}
						if (ind == 1) { //服务编号
							ele.parentList.forEach((e, i) => {
								e.codeType = "服务编号";
								newData.push(e);
							})
							this.serviceNumber=ele.parentList;
						}
						if (ind == 2) { //分享编号
							ele.introducerList.forEach((e, i) => {
								e.codeType = "分享编号";
								newData.push(e);
							})
							this.ShareNumber=ele.introducerList;
						}
					})
					console.log(this.customerNumber);
					this.surveyList = newData;
					this.isShow=true;
					uni.hideLoading();
				}).catch((err) => {

				})
			}
		}
	}
</script>

<style lang="scss">
	body,
	page {
		background: #fff;
		padding: 0rpx;
		box-sizing: border-box;
	}

	.surveyBox {
		.surveyListBox {
			margin-bottom: 30rpx;
			box-shadow: 0px 0px 10px #e6e6e6;
			border-radius: 21rpx;
			padding: 35rpx 30rpx 20rpx 30rpx;
			box-sizing: border-box;

			>view {
				display: flex;
				justify-content: space-between;
				line-height: 45rpx;
				font-size: 30rpx;
				margin-bottom: 25rpx;
			}
		}
	}

	.detailedBox {
		width: 100%;
		height: auto;
		padding: 20rpx 30rpx;
		box-sizing: border-box;
		box-shadow: 0px 0px 10px #e6e6e6;
		border-radius: 21rpx;

		.detailedTotal {
			text-align: center;

			.amount {
				font-size: 56rpx;
				font-weight: bold;
				margin-top: 25rpx;
				margin-bottom: 20rpx;
			}
		}

		>view.detailedBoxItem>view {
			display: flex;
			justify-content: space-between;
			line-height: 45rpx;
			font-size: 30rpx;
			margin-top: 25rpx;
		}
	}

	//新增表格样式
	.achievement_table {
		width: 100%;
		height: auto;
		font-size:24rpx;
		//border: 1px solid #e9eaec;
		
		.achievement_th {
			width: 100%;
			font-size:25rpx;
			position: relative;
			>view {
			    display:inline-block;
				vertical-align: middle;
				text-align: center;
				//height:120rpx;
				line-height: 60rpx;
				padding: 10rpx 0rpx;
				box-sizing: border-box;
			}
			>view.W10 {
				width: 10%;
			}

			>view.W20 {
				width: 19.5%;
			}

			>view.W15 {
				width: 15%;
			}

			>view.W30 {
				width: 30%;
			}
		}
		.achievement_th:nth-child(1){
			font-size:28rpx;
			font-weight: bold;
			border-bottom:1px solid #e9eaec;
		}
		.firstBor{
			font-size:26rpx;
			color:#000;
			font-weight: 400;
		}
	}
</style>
